@extends("admin.framework.layouts.main")
@push('styles')
    <style>
        .Va-container-content{
            height: 72vw;
        }
    </style>
@endpush
@section("content")
    <div class="form-container">
        <el-row :gutter="24" justify="start" type="flex">
            <el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="12" :push="4">
                <el-form ref="formsModel" :model="formsModel" label-position="right" label-width="140px" size="medium" class="Va-forms" data-7512a93d>

                    <div class="forms-divider" style="clear: both"><span class="left">基本配置</span> </div>
                    <el-form-item label="登录页背景图" prop="login_bg" class="forms-items-left">
                        <va-picture v-model="formsModel.login_bg" :size="2" :alt="false"></va-picture>
                        <va-forms-tips>图片尺寸：1920*1080</va-forms-tips>
                    </el-form-item>

                    <el-form-item label="登录页LOGO" prop="login_logo" class="forms-items-left">
                        <va-picture v-model="formsModel.login_logo" :alt="false"></va-picture>
                        <va-forms-tips>图片尺寸：150*50</va-forms-tips>
                    </el-form-item>

                    <el-form-item label="登录页标题"  prop="login_title" class="forms-items-left">
                        <el-input v-model="formsModel.login_title" placeholder="请填写登录页标题" maxlength="12" show-word-limit></el-input>
                    </el-form-item>

                    <el-form-item label="左侧标题" prop="left_title" class="forms-items-left">
                        <el-input v-model="formsModel.left_title" placeholder="请填写左侧标题" maxlength="20" show-word-limit></el-input>
                    </el-form-item>

                    <el-form-item label="左侧图标" prop="left_logo" class="float-clear">
                        <va-picture v-model="formsModel.left_logo" :alt="false"></va-picture>
                        <va-forms-tips>图片尺寸：36*36</va-forms-tips>
                    </el-form-item>
                    <div class="forms-divider float-clear"><span class="left">安全设置</span> </div>
                    <el-form-item label="登录IP白名单"  prop="admin_ips">
                        <el-input v-model="formsModel.admin_ips" placeholder="请填写登录IP白名单" type="textarea" :rows="3"></el-input>
                        <va-forms-tips> 多个IP用【,】隔开；如202.194.133.1/24,202.194.132.0。允许所有IP访问请留空或*。</va-forms-tips>
                    </el-form-item>

                    <el-form-item label="记录登录日志" prop="admin_log" class="forms-items-left">
                        <el-switch v-model="formsModel.admin_log" active-text="开启" inactive-text="关闭"></el-switch>
                    </el-form-item>

                    <el-form-item label="单用户登录" prop="admin_login" class="forms-items-right">
                        <el-switch v-model="formsModel.admin_login" active-text="开启" inactive-text="关闭"></el-switch>
                        <va-forms-tips>开启后，单个用户同一时间只能在线一个</va-forms-tips>
                    </el-form-item>

                    <div class="float-clear"></div>

                    <el-form-item class="forms-fixed-bottom">
                        <div class="Va-text-left" data-7512a93d>
                            <el-button class="Va-button" type="primary" size="medium"  @click="formsModelSubmit" :loading="config.loading" :disabled="config.disabled">
                                @{{config.loading ? '提交中...' : '提 交'}}
                            </el-button>
                            <el-button class="Va-button" @click="redirectPage('framework/setup/page/setting')" type="default" size="medium">刷 新</el-button>
                        </div>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
    </div>
@endsection
{{--  扩展页面  --}}
@section("page")
@endsection
@push('scripts')
    <script>
        var $App = new Vue({
            el: '#app',
            mixins: [$Config,$Layouts],
            data: {
                tabsPaneItems:[
                    {label:'基本设置', value:'1',icon:''},
                    {label:'安全设置', value:'2',icon:''},
                    {label:'32432', value:'3',icon:''},
                    {label:'32423', value:'4',icon:''},
                ],
                config:{activeTabs:'1', permissions:false, menu_id:0,loading:false,view_loading:true,webSource:'basic',__table:'SiteSettings'},
                formsModel:{
                    login_bg:'',login_logo:'',login_title:'',left_logo:'',left_title:'',
                    admin_ips:'',login_address:'1', custom_address:'admin',admin_log:true, admin_login:false,login_error:10, login_code:3,
                    layout:'2',
                },
            },
            methods:{
                webSourceChange(e) {
                    var that = this;
                },

                formsModelSubmit()
                {
                    var that = this;
                    that.config.loading = true;
                    that.$refs['formsModel'].validate(function (valid) {
                        if (valid) {
                            that.formsModel.__table = that.config.__table;
                            $Request.postJson('framework/setup/pageUpdateSetup', that.formsModel, function (res) {
                                if(res.code === 200){
                                    that.$Message(res.message, function () {
                                        that.getFormsModule();
                                    });
                                } else {
                                    that.config.loading = false;
                                    that.$Message(res.message, 'warning');
                                }
                            })
                        } else {
                            that.config.loading = false;
                        }
                    });
                },

                getFormsModule()
                {
                    var that = this;

                    $Request.postJson('framework/setup/pageGetSetup', {__table: that.config.__table}, function (res) {
                        if(res.code === 200){
                            if(res.result && !Array.isArray(res.result)){
                                that.formsModel = res.result;
                            }
                        }
                        that.config.view_loading = false;
                        that.config.loading = false;
                    })
                }
            },
            mounted(){
                this.getFormsModule();
            },
            created() {

            },
        })
    </script>
@endpush